import * as echarts from "echarts";
import { useEffect, useRef } from "react";
const BarChart = (props) => {
  const chartRef = useRef(null);
  console.log("title", props.title);
  useEffect(() => {
    const chartDom = chartRef.current;
    const chart = echarts.init(chartDom);
    const option = {
      title: {
        text: props.title,
      },
      tooltip: {},
      xAxis: {
        data: ["苹果", "香蕉", "橘子", "梨", "葡萄"],
      },
      yAxis: {},
      series: [
        {
          name: "销量",
          type: "bar",
          data: [5, 20, 36, 10, 10],
        },
      ],
    };
    option && chart.setOption(option);
  }, []);
  return (
    <div ref={chartRef} style={{ width: "600px", height: "300px" }}>
      Home
    </div>
  );
};
export default BarChart;
